<!-- Page header -->
<div class="page-header d-print-none">
  <div class="container-xl">
    <div class="row g-2 align-items-center">
      <div class="col-8">
        <!-- 页面标题 -->
        <h2 class="page-title">
          投递记录
        </h2>
        <div class="text-muted mt-1 bit-paginator-text"></div>
      </div>
    </div>
  </div>
</div>
<!-- Page body -->
<div class="page-body">
  <div class="container-xl">
    <div class="row g-3">
      <ul class="timeline" id="record-receive-items-body">
        <!-- 第一行卡片开始 -->
        <!-- <li class="timeline-event">
          <div class="timeline-event-icon bg-twitter-lt">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg>
          </div>
          <div class="card timeline-event-card">
            <div class="card-body">

              <div class="row g-0 align-items-center">
                <div class="col-auto">
                  <div class="card-body">
                    <div class="avatar avatar-xl" style="background-image: url(./static/jobs/job-9.png)"></div>
                  </div>
                </div>
                <div class="col">
                  <div class="card-body ps-0">

                    <div class="row">
                      <div class="col-md">
                        <div class="mt-3 list-inline list-inline-dots mb-0">
                          <div class="list-inline-item">
                            <h3 class="mb-0">
                              <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>
                                <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
                             </svg>
                              小比特
                            </h3>
                          </div>
                          <div class="list-inline-item">
                            <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-macro"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6 15a6 6 0 1 0 12 0" /><path d="M18 15a6 6 0 0 0 -6 6" /><path d="M12 21a6 6 0 0 0 -6 -6" /><path d="M12 21v-10" /><path d="M12 11a5 5 0 0 1 -5 -5v-3l3 2l2 -2l2 2l3 -2v3a5 5 0 0 1 -5 5z" /></svg>
                            软件工程系
                          </div>
                        </div>
                      </div>
                      <div class="col-auto fs-3 mt-3 text-muted">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-briefcase"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 7m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" /><path d="M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2" /><path d="M12 12l0 .01" /><path d="M3 13a20 20 0 0 0 18 0" /></svg>
                        <strong>Frontend Web Engineer</strong>
                      </div>
                      <div class="col-auto fs-3 mt-3 text-blue text-muted">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg>
                        <strong>140,000</strong> - <strong>180,000</strong>
                      </div>
                    </div>

                    <div class="row">
                      <div class="col-md">
                        <div class="mt-3 list-inline list-inline-dots mb-0">
                          <div class="list-inline-item">
                            <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-device-mobile"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6 5a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-14z" /><path d="M11 4h2" /><path d="M12 17v.01" /></svg>
                           15366668888
                          </div>
                          <div class="list-inline-item">
                            <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-mail"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10z" /><path d="M3 7l9 6l9 -6" /></svg>
                            xiaobite@bite.com
                          </div>
                          <div class="list-inline-item">
                            <a href="javascript:void(0);" target="_blank">
                              <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-eye"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0" /><path d="M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6" /></svg>
                              查看简历
                            </a>
                          </div>
                        </div>
                      </div>
                      <div class="col-md-auto">
                        <div class="mt-3 badges">
                            <div class="list-inline list-inline-dots mb-0">
                              <div class="list-inline-item text-muted">
                                <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10 14l11 -11" /><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5" /></svg>
                                2023-02-22 15:36:23
                              </div>
                            </div>
                        </div>
                      </div>
                    </div>

                    <div class="row">
                      <div class="col-md mt-3">
                        <div class="col-6">
                          <p>5年JAVA开发经验，精通Spring、MySQL数据库及常用框架和中间件，参与过多个项目的设计与开发...</p>
                        </div>
                      </div>
                      <div class="col-md-auto mt-3 fs-3">
                        <span class="badge badge-outline text-yellow">未处理</span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-auto" style="margin-right: 1em;">
                  <div class="dropdown">
                    <a href="javascript:void(0);" class="btn-action" data-bs-toggle="dropdown" aria-expanded="false">
                      <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg>
                    </a>
                    <div class="dropdown-menu dropdown-menu-end">
                      <a href="javascript:void(0);" class="dropdown-item record-list-interview" data-bs-toggle="modal" data-bs-target="#modal-record-reply">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-calendar-month"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z" /><path d="M16 3v4" /><path d="M8 3v4" /><path d="M4 11h16" /><path d="M7 14h.013" /><path d="M10.01 14h.005" /><path d="M13.01 14h.005" /><path d="M16.015 14h.005" /><path d="M13.015 17h.005" /><path d="M7.01 17h.005" /><path d="M10.01 17h.005" /></svg>
                         &nbsp;&nbsp;约面试
                      </a>
                      <a href="javascript:void(0);" class="dropdown-item record-list-offer" data-bs-toggle="modal" data-bs-target="#modal-record-reply">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-heart-handshake"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M19.5 12.572l-7.5 7.428l-7.5 -7.428a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572" /><path d="M12 6l-3.293 3.293a1 1 0 0 0 0 1.414l.543 .543c.69 .69 1.81 .69 2.5 0l1 -1a3.182 3.182 0 0 1 4.5 0l2.25 2.25" /><path d="M12.5 15.5l2 2" /><path d="M15 13l2 2" /></svg>
                         &nbsp;&nbsp;发OFFER
                      </a>
                      <a href="javascript:void(0);" class="dropdown-item text-red record-list-reject" data-bs-toggle="modal" data-bs-target="#modal-record-reject">
                        <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-trash"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 7l16 0" /><path d="M10 11l0 6" /><path d="M14 11l0 6" /><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" /><path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" /></svg>
                         &nbsp;&nbsp;拒绝
                      </a>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </li> -->
      </ul>
      <!-- 以上是内容 -->
    </div>

    <!-- 分页 -->
    <div class="row mt-4">
      <div class="d-flex align-items-center">
        <p class="m-0 text-muted bit-paginator-text"></p>
        <ul class="bit-paginator pagination m-0 ms-auto"></ul>
      </div>
    </div>
  </div>
</div>

<!-- 附加消息模态框 -->
<div class="modal modal-blur fade" id="modal-record-reply" tabindex="-1" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">附加消息</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-lg-12">
            <div>
              <textarea id="record-list-state-remark" class="form-control" rows="8" placeholder="这里的内容将以邮件的形式发送到对方邮箱"></textarea>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <a href="javascript:void(0);" class="btn btn-link link-secondary" data-bs-dismiss="modal">
          取消
        </a>
        <a href="javascript:void(0);" class="btn btn-primary ms-auto" data-bs-dismiss="modal" id="record-list-state-submit">
          <!-- Download SVG icon from http://tabler-icons.io/i/plus -->
          <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-check"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10" /></svg>
          发送
        </a>
      </div>
    </div>
  </div>
</div>

<!-- 拒绝模态框 -->
<div class="modal modal-blur fade" id="modal-record-reject" tabindex="-1" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
    <div class="modal-content">
      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      <div class="modal-status bg-danger"></div>
      <div class="modal-body text-center py-4">
        <!-- Download SVG icon from http://tabler-icons.io/i/alert-triangle -->
        <svg xmlns="http://www.w3.org/2000/svg" class="icon mb-2 text-danger icon-lg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 9v2m0 4v.01"></path><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path></svg>
        <h3>您将拒绝对方的请求?</h3>
        <div class="text-muted">点击确定拒绝对方的投递请求.</div>
      </div>
      <div class="modal-footer">
        <div class="w-100">
          <div class="row">
            <div class="col"><a href="javascript:void(0);" class="btn w-100" data-bs-dismiss="modal">
                取消
              </a></div>
            <div class="col"><a href="javascript:void(0);" class="btn btn-danger w-100" data-bs-dismiss="modal" id="record-list-state-reject-submit">
                确定
              </a></div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<script>
  $(function(){
    // 记录当前页号
    let cuuurentPageNum = 1;
    // 修改的记录Id
    let recordId;
    // 修改的目标状态
    let recordState;
    // 修改操作的行
    let optRecordRow;
    // 加载投递记录列表
    function loadRecordList(pageNum) {
      // 分页对象
      let sendData = {
        pageNum : pageNum,
        pageSize : pageSize,
        sort : 'id',
        order : 'desc'
      }
      // 发送AJAX请求
      $.ajax({
        type : 'get',
        url : 'deliver/pageByReceiveUser',
        contentType: 'application/x-www-form-urlencoded',
        data : sendData,
        success : function (respData) {
          // 失败
          if (respData.code != 0) {
            // 提示
            $.toast({
              heading: '提示',
              text: respData.message,
              icon: 'info'
            });
            return;
          }
          // 成功构建页面
          buildRecordList(respData.data);
        }
      });
    }

    // 第一次加载页面
    loadRecordList(cuuurentPageNum);

    // 构建列表
    function buildRecordList(data) {
      // 清空原有内容
      $('#record-receive-items-body').html('');
      // 结果为空
      if (data.rows.length == 0) {
        // 显示内容
        $('#record-receive-items-body').html('<h3>没有职位记录</h3>');
        // 清空分页信息
        $('.bit-paginator-text').html('');
        $('.bit-paginator').html('');
        return;
      }
      // 遍历结果
      data.rows.forEach(record => {
        // 头像
        if (!record.sendUser.avatarUrl) {
          record.sendUser.avatarUrl = avatarUrl;
        }
        // 薪资
        let priceHtml;
        if (!record.job.rewardLower || !record.job.rewardUpper) {
          priceHtml = '<strong>薪资面议</strong>';
        } else {
          priceHtml = ' <strong>' + record.job.rewardLower + '</strong> - <strong>' + record.job.rewardUpper + '</strong> '
        }
        // 状态
        let stateHtml;
        switch (record.state) {
          case 2:
            stateHtml = '<span class="badge badge-outline text-purple">面试中</span>';
            break;
          case 3:
            stateHtml = '<span class="badge badge-outline text-red">OFFER</span>';
            break;
          case 4:
            stateHtml = '<span class="badge badge-outline text-green">已接受</span>';
            break;
          case 5:
            stateHtml = '<span class="badge badge-outline text-muted">已拒绝</span>';
            break;
          case 6:
            stateHtml = '<span class="badge badge-outline text-indigo">已入职</span>';
          break;
          default:
            stateHtml = '<span class="badge badge-outline text-yellow">未处理</span>';
            break;
        }
        // 一行记录
        let rowHtmlStr = '<li class="timeline-event">'
          + ' <div class="timeline-event-icon bg-twitter-lt">'
          + ' <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M10 14l11 -11"></path><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5"></path></svg>'
          + ' </div>'
          + ' <div class="card timeline-event-card">'
          + ' <div class="card-body">'
          + ' <div class="row g-0 align-items-center">'
          + ' <div class="col-auto">'
          + ' <div class="card-body">'
          + ' <div class="avatar avatar-xl" style="background-image: url(' + record.sendUser.avatarUrl + ')"></div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col">'
          + ' <div class="card-body ps-0">'
          + ' <div class="row">'
          + ' <div class="col-md">'
          + ' <div class="mt-3 list-inline list-inline-dots mb-0">'
          + ' <div class="list-inline-item">'
          + ' <h3 class="mb-0">'
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-user" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">'
          + ' <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>'
          + ' <path d="M12 7m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>'
          + ' <path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>'
          + ' </svg>'
          + record.sendUser.name
          + ' </h3>'
          + ' </div>'
          + ' <div class="list-inline-item">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-macro"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6 15a6 6 0 1 0 12 0" /><path d="M18 15a6 6 0 0 0 -6 6" /><path d="M12 21a6 6 0 0 0 -6 -6" /><path d="M12 21v-10" /><path d="M12 11a5 5 0 0 1 -5 -5v-3l3 2l2 -2l2 2l3 -2v3a5 5 0 0 1 -5 5z" /></svg>'
          + record.sendUser.major.name
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col-auto fs-3 mt-3 text-muted">'
          + ' <h3 class="mb-0"><a href="javascript:void(0);" class="record-list-title-btn">' 
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-briefcase"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 7m0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v9a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z" /><path d="M8 7v-2a2 2 0 0 1 2 -2h4a2 2 0 0 1 2 2v2" /><path d="M12 12l0 .01" /><path d="M3 13a20 20 0 0 0 18 0" /></svg>'
          + record.job.title
          + ' </a></h3>'
          + ' </div>'
          + ' <div class="col-auto fs-3 mt-3 text-blue text-muted">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-report-money"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /><path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /><path d="M14 11h-2.5a1.5 1.5 0 0 0 0 3h1a1.5 1.5 0 0 1 0 3h-2.5" /><path d="M12 17v1m0 -8v1" /></svg>'
          + priceHtml
          + ' </div>'
          + ' </div>'
          + ' <div class="row">'
          + ' <div class="col-md">'
          + ' <div class="mt-3 list-inline list-inline-dots mb-0">'
          + ' <div class="list-inline-item">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-device-mobile"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M6 5a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-14z" /><path d="M11 4h2" /><path d="M12 17v.01" /></svg>'
          + record.sendUser.phoneNum
          + ' </div>'
          + ' <div class="list-inline-item">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-mail"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10z" /><path d="M3 7l9 6l9 -6" /></svg>'
          + record.sendUser.email
          + ' </div>'
          + ' <div class="list-inline-item">'
          + ' <a href="' + record.sendUser.resumeUrl + '" target="_blank">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-eye"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0" /><path d="M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6" /></svg>'
          + ' 查看简历'
          + ' </a>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col-md-auto">'
          + ' <div class="mt-3 badges">'
          + ' <div class="list-inline list-inline-dots mb-0">'
          + ' <div class="list-inline-item text-muted">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-send"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M10 14l11 -11" /><path d="M21 3l-6.5 18a.55 .55 0 0 1 -1 0l-3.5 -7l-7 -3.5a.55 .55 0 0 1 0 -1l18 -6.5" /></svg>'
          + record.createTime
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="row">'
          + ' <div class="col-md mt-3">'
          + ' <div class="col-6">'
          + ' <p>' + record.sendUser.remark + '</p>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col-md-auto mt-3 fs-3 record-list-state">'
          + stateHtml
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' <div class="col-auto" style="margin-right: 1em;">'
          + ' <div class="dropdown">'
          + ' <a href="javascript:void(0);" class="btn-action" data-bs-toggle="dropdown" aria-expanded="false">'
          + ' <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 5m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg>'
          + ' </a>'
          + ' <div class="dropdown-menu dropdown-menu-end">'
          + ' <a href="javascript:void(0);" class="dropdown-item record-list-interview" data-bs-toggle="modal" data-bs-target="#modal-record-reply">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-calendar-month"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z" /><path d="M16 3v4" /><path d="M8 3v4" /><path d="M4 11h16" /><path d="M7 14h.013" /><path d="M10.01 14h.005" /><path d="M13.01 14h.005" /><path d="M16.015 14h.005" /><path d="M13.015 17h.005" /><path d="M7.01 17h.005" /><path d="M10.01 17h.005" /></svg>'
          + ' &nbsp;&nbsp;约面试'
          + ' </a>'
          + ' <a href="javascript:void(0);" class="dropdown-item record-list-offer" data-bs-toggle="modal" data-bs-target="#modal-record-reply">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-heart-handshake"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M19.5 12.572l-7.5 7.428l-7.5 -7.428a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572" /><path d="M12 6l-3.293 3.293a1 1 0 0 0 0 1.414l.543 .543c.69 .69 1.81 .69 2.5 0l1 -1a3.182 3.182 0 0 1 4.5 0l2.25 2.25" /><path d="M12.5 15.5l2 2" /><path d="M15 13l2 2" /></svg>'
          + ' &nbsp;&nbsp;发OFFER'
          + ' </a>'
          + ' <a href="javascript:void(0);" class="dropdown-item text-red record-list-reject" data-bs-toggle="modal" data-bs-target="#modal-record-reject">'
          + ' <svg  xmlns="http://www.w3.org/2000/svg"  width="24"  height="24"  viewBox="0 0 24 24"  fill="none"  stroke="currentColor"  stroke-width="2"  stroke-linecap="round"  stroke-linejoin="round"  class="icon icon-tabler icons-tabler-outline icon-tabler-trash"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 7l16 0" /><path d="M10 11l0 6" /><path d="M14 11l0 6" /><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" /><path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" /></svg>'
          + ' &nbsp;&nbsp;拒绝'
          + ' </a>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </div>'
          + ' </li>'
        // 转换对象
        let recordRowEL = $(rowHtmlStr);
        // 绑定事件
        // 详情
        recordRowEL.find('.record-list-title-btn').click(function () {
          // 当前访问的职位Id
          currentJobId = record.job.id;
          // 加载编辑页
          $('#bit-page-content').load('job_details.html');
        });
        // 约面试
        recordRowEL.find('.record-list-interview').click (function () {
          recordId = record.id;
          recordState = 2;
          optRecordRow = recordRowEL;

        });
        // 发Offer
        recordRowEL.find('.record-list-offer').click (function () {
          recordId = record.id;
          recordState = 3;
          optRecordRow = recordRowEL;
        });
        // 拒绝
        recordRowEL.find('.record-list-reject').click (function () {
          recordId = record.id;
          recordState = 5;
          optRecordRow = recordRowEL;
        });
        // 追加到页面
        $('#record-receive-items-body').append(recordRowEL);
        
      });
      
      // 显示分页
      buildJobPaginator(data);
    }

    // 分页显示
  function buildJobPaginator (data) {
      $('.bit-paginator').jqPaginator({
        totalPages: data.totalPage,
        visiblePages: 10,
        currentPage: data.pageNum,
        first: '<li class="page-item first"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M11 7l-5 5l5 5" /><path d="M17 7l-5 5l5 5" /></svg></a></li>',
        prev: '<li class="page-item prev"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M15 6l-6 6l6 6" /></svg></a></li>',
        next: '<li class="page-item next"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M9 6l6 6l-6 6" /></svg></a></li>',
        last: '<li class="page-item last"><a class="page-link" href="javascript:void(0)"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevrons-right"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M7 7l5 5l-5 5" /><path d="M13 7l5 5l-5 5" /></svg></a></li>',
        page: '<li class="page-item page"><a class="page-link" href="javascript:void(0)">{{page}}</a></li>',
        onPageChange: function (pageNum, type) {
            $('.bit-paginator-text').html('当前显示第 ' + pageNum + ' / ' + data.totalPage + ' 页');
            // 当前访问的页号
            cuuurentPageNum = pageNum;
            // 加载职位列表
            if (type == 'change') {
              loadRecordList(pageNum);
            }
        }
    });
  }

  // 绑定修改状态提交按钮事件
  $('#record-list-state-submit').click(function () {
    // 修改的记录Id
    // let recordId;
    // 修改的目标状态
    // let recordState;
    // 构造提交的数据对象
    let sendData = {
      id : recordId,
      state : recordState,
      remark : $('#record-list-state-remark').val()
    };
    // 发送请求
    changeState(sendData);
  });

  // 绑定拒绝提交按钮事件
  $('#record-list-state-reject-submit').click(function () {
    let sendData = {
      id : recordId,
      state : recordState
    };
    // 发送请求
    changeState(sendData);
  });

  // 修改状态
  function changeState (sendData) {
    if (!sendData) {
      return;
    }
    // 发送AJAX
    $.ajax ({
      type : 'post',
      url : 'deliver/state',
      data : JSON.stringify(sendData),
      success : function (respData) {
        if (respData.code == 0) {
          // 提示
          $.toast({
            heading: '提示',
            text: '操作成功.',
            icon: 'success'
          });
          console.info(sendData);
          let stateHtml;
          // 修改行中显示的状态
          switch (sendData.state) {
            case 2:
              stateHtml = '<span class="badge badge-outline text-purple">面试中</span>';
              break;
            case 3:
              stateHtml = '<span class="badge badge-outline text-red">OFFER</span>';
              break;
            case 5:
              stateHtml = '<span class="badge badge-outline text-muted">已拒绝</span>';
              break;
            default:
              break;
          }
          console.info(optRecordRow);
          if (!stateHtml) {
            return;
          }
          // 更新页面内容
          optRecordRow.find('.record-list-state').html(stateHtml);
          // 清空输入框内容
          $('#record-list-state-remark').val('');
        } else {
          // 提示
          $.toast({
            heading: '提示',
            text: respData.message,
            icon: 'info'
          });
        }
      }

    });
  }
    
  });
</script>